<template>
  <div class="subPage">
    <!-- topTab -->
    <div class="topTab" >
      <ul>
        <li v-for="(item, index) in topTabList" :key="index" :class="{'nowLi':nowLiIndex===index}" @click="chooseTopType(index)">{{item}}</li>
      </ul>
    </div>
    <!-- tab -->
    <!-- <div class="subTop">
      <i-tabs :current="tab" @change="handleChange">
        <i-tab v-for="(item, index) in tabList" :key="item.key" :title="item.title" :count="item.count">
        </i-tab>
      </i-tabs>
    </div> -->
    <div class="subTop" >
      <ul>
        <li v-for="(item,i) in tabList" :key="item.key" :class="{'nowTab':tab===item.key}" @click="handleChange(item.key)" >
          {{item.title}}
        </li>
        <span
        :class="[
          'slideSpan',
          {'chooseTabSpan2':tab==='tab2' && nowLiIndex == 0},
          {'chooseTabSpan3':tab==='tab3' && nowLiIndex == 0},
          {'chooseTabSpan11':tab==='tab1' && nowLiIndex > 0},
          {'chooseTabSpan12':tab==='tab2' && nowLiIndex > 0},
          {'chooseTabSpan13':tab==='tab3' && nowLiIndex > 0},
          {'chooseTabSpan14':tab==='tab4' && nowLiIndex > 0}
        ]" >
        </span>
      </ul>
    </div>
    <span :class="[{'sideBtn':true}, {'hidden': !isShow}]">
      <span class="left" @click="isShow = !isShow">
        <img src="/static/images/side.png" alt="#">
      </span>
      <span class="btn" @click="goCheckout">切换</span>
    </span>
    <div class="content">
      <!-- tab1列表 -->
      <scroll-view
      :scroll-y="true"
      v-if="allOrder.length > 0"
      style="height:100%"
      :refresher-enabled="true"
      :refresher-triggered="triggered"
      @refresherrefresh="queryPrescriptionList" >
        <div class="allList">
          <ul>
            <li v-for="(item, index) in allOrder" :key='index + item'  @click="getDetails(item,'detail')" >
              <div class="initTop clearfix">
                <div class="fl orderno" v-if="nowLiIndex===0">处方号:{{item.orderno}}</div>
                <div class="fl orderno" v-else>{{item.orderno}}</div>
                <div class="fr" v-if="nowLiIndex===0">
                  <!-- 待支付-->
                  <div v-if="item.status == '0'||item.status == '10'" class="status status0">{{item.status_str}}</div>
                  <!-- 待处理-->
                  <div v-else-if="item.status == '13'" class="status status13">{{item.status_str}}</div>
                  <!-- 已完成 已支付 -->
                  <span v-else-if="item.status == '2' || item.status == '3'" class="status status23">{{item.status_str}}</span>
                  <!-- 已失效 订单异常 -->
                  <span v-else-if="item.status == '5' || item.status == '12'" class="status status512">{{item.status_str}}</span>
                  <!-- 其他 -->
                  <span v-else class="status statuselse">{{item.status_str}}</span>
                </div>
                <div class="fr" v-else>
                  <!-- 待支付-->
                  <div v-if="item.status == '0'||item.status == '10'" class="status status0">{{item.status_str}}</div>
                  <!-- 待处理-->
                  <!-- <div v-else-if="item.status == '13'" class="status status13">{{item.status_str}}</div> -->
                  <!-- 已完成 已支付 -->
                  <span v-else-if="item.status == '1' || item.status == '2' || item.status == '3' || item.status == '4' || item.status == '7' || item.status == '8'" class="status status23">{{item.status_str}}</span>
                  <!-- 已失效 订单异常 -->
                  <span v-else-if="item.status == '5'|| item.status == '13'|| item.status == '6' || item.status == '9'" class="status status512">{{item.status_str}}</span>
                   <!-- 检查取消订单 -->
                  <span v-else-if=" item.status == '14'" class="status status512">{{item.status_str}}</span>
                  <!-- 其他 -->
                  <span v-else class="status statuselse">{{item.status_str}}</span>
                </div>
              </div>
              <div class="initBtm clearfix">
                <div class="itemLine1">
                  <p>
                    <span class="doctorName">{{item.regular_name}}</span><span>{{item.sex}}<span><span class="xiegang">/</span></span>{{item.age}}岁</span>
                  </p>
                </div>
                <div class="btmFlex">
                  <div class="itemBtmFl">
                    <div class="itemLine1 lineTitle" v-if="nowLiIndex===0">负责医生：</div>
                    <div class="itemLine1 lineTitle" v-if="nowLiIndex===0">处方药品：</div>
                    <div class="itemLine1 lineTitle">费用金额：</div>
                    <div class="itemLine1 lineTitle" v-if="nowLiIndex!==0">检查项目：</div>
                    <div class="itemLine1 lineTitle" v-if="(item.status !== '5' && item.status !== '12' && item.status !== '13' && item.status !== '14' && item.point_type !== '2')">支付时间：</div>
                    <div class="itemLine1 lineTitle" >费用合计：</div>
                  </div>
                  <div class="itemBtmFr clearfix">
                    <div class="itemLine1 nowrap" v-if="nowLiIndex===0">
                      {{item.doctor_name}}　<span>{{item.positional_title}}<span><span class="xiegang">/</span></span>{{item.dept_name}}</span>
                    </div>
                    <div class="clearfix yaoping" v-if="nowLiIndex===0">
                      <div class="fl">{{item.check_item_list[0]}}</div>
                      <div class="fl">共{{item.check_item_list.length}}项</div>
                    </div>
                    <div class="itemLine1">
                      <span v-if="nowLiIndex>0">￥</span>
                      {{item.itemsum}}
                    </div>
                    <div class="clearfix yaoping" v-if="nowLiIndex!==0">
                      <div class="fl">
                        <span v-for="(text, i) in item.check_item_list" :key="i">{{i === (item.check_item_list.length -1) ? text : text + '、'}}</span>
                      </div>
                      <div class="fr">
                        <span ></span>
                        共{{item.check_item_list.length}}项
                      </div>
                    </div>
                    <!-- 异常订单 逾期支付不显示   重症待处理：item.status=== '13' -->
                    <div v-if="(item.status !== '5' && item.status !== '12' && item.status !== '13' && item.status !== '14' && item.point_type !== '2')">
                      <div class="itemLine1 shengyu" v-if="item.status == '0'||item.status == '10'">
                        剩余 {{item.countDown}}
                      </div>
                      <div v-else class="itemLine1">
                        {{item.zhifu}}
                      </div>
                    </div>
                    <div class="itemLine1" >
                      <span v-if="nowLiIndex>0">￥</span>
                      {{item.ordersum}}
                    </div>
                  </div>
                </div>
                <div class="clearfix do">
                  <!-- 异常订单不显示 -->
                  <!-- <div v-if=" item.status !== '5' && item.status !== '12'"> -->
                    <!-- 普通门诊待支付  显示去支付按钮 -->
                    <!-- <div class="fr doBtn look" v-if="nowLiIndex>0 && (item.status === '0'||item.status === '10')" @click.stop="goPay(item)">
                      去支付
                    </div> -->
                    <!-- 重症门诊显示待处理 -->
                    <!-- <div class="fr doBtn look" v-if="item.status === '13'" @click.stop="goPay(item)">
                      去处理
                    </div> -->
                    <!-- <div class="fr doBtn look" v-if="item.status === '13'" @click.stop="goPrescriptionDetails(item)">
                      去处理
                    </div> -->
                    <!-- <div class="fr doBtn look" v-if="nowLiIndex>0 && (item.status === '1' || item.status === '2' || item.status === '3' || item.status === '4')" @click.stop="refundMoney(item)">
                      申请退款
                    </div> -->
                    <!-- 其他状态显示查看详情 -->
                    <!-- <div class="fr doBtn look" v-else @click="goPay(item)">
                      查看详情
                    </div> -->
                  <!-- </div> -->
                  <div class="fr doBtn look" v-if=" item.status !== '5' && item.status !== '12' && nowLiIndex>0 && (item.status === '0'||item.status === '10')" @click.stop="getDetails(item,'pay')">
                    去支付
                  </div>
                  <div class="fr doBtn" @click.stop="getDetails(item,'prescriptionDetails')" v-if="nowLiIndex===0">
                    {{(item.status === '0'||item.status === '10')?'去支付':(item.status === '13')?'去处理':'查看详情'}}
                  </div>
                  <div class="fr doBtn" @click.stop="showPdf(item.orderno)" v-if="nowLiIndex===0">
                    查看处方
                  </div>
                </div>
              </div>
            </li>
          </ul>
        </div>
        <div style="height:5rpx" ></div>
      </scroll-view>
      <div v-if="allOrder.length===0 && !delayShowData" class="noDataImg">
        <img :src="noDataImg" class="prescript" />
        <!-- <div class="describe" v-if="nowLiIndex!==0">
          请携带就诊卡及身份证前往2号楼(泰康1楼)"转诊病人服务中心"打印导诊单完成相关检验或检查等项目
        </div> -->
      </div>
    </div>
    <div class="describe" v-if="nowLiIndex===0">
      <p v-for="(item, index) in rule_text" :key="index">
        <span>*</span>{{item.rule_text}}
      </p>
    </div>
    <div class="describe" v-if="nowLiIndex!==0">
      <p><span>*</span>{{rule_text[0].rule_text}}</p>
      <p><span>*</span>请携带就诊卡及身份证件前往首义院区”门诊自助设备服务区“（2号楼泰康楼前），打印“导诊单”完成相关检验或检查项目</p>
    </div>
    <!-- 申请退款 -->
    <div v-if="visible" class="bg" @click="visible = false">
      <div class="init" @click.stop>
        <div class="initTop">
          退款原因
          <img :src="closeTipsImg" @click="visible = false" />
        </div>
        <div class="initMid">
          <div style="margin-left: 30rpx;">
            <radio-group @change="changeRadio">
              <radio class="radio" value="0" color="#507BFC">
                <text>临时有事</text>
              </radio>
              <br />
              <radio class="radio" value="1" color="#507BFC">
                <text>不想挂了</text>
              </radio>
              <br />
              <radio class="radio" value="3" color="#507BFC">
                <text>已更改就诊方式 </text>
              </radio>
              <br />
              <radio class="radio" value="4" color="#507BFC">
                <text>开错了 / 开多了</text>
              </radio>
              <br />
              <radio class="radio" value="5" color="#507BFC">
                <text>疾病与检查不符</text>
              </radio>
              <br />
              <radio class="radio" value="6" color="#507BFC">
                <text>个人原因无法到院检查</text>
              </radio>
              <br />
              <radio class="radio lastRadio" value="2" color="#507BFC">
                <text>其他原因</text>
              </radio>
              <br />
            </radio-group>
          </div>
          <div class="areaDiv clearfix" v-if="reason_code==2">
            <textarea
              placeholder="其他原因"
              disable-default-padding="true"
              maxlength="100"
              :value="reason"
              @input="inputchange"
            />
            <div class="fr" style="color: #CCCCCC; font-size: 30rpx;">{{reason.length}} / 100 字</div>
          </div>
        </div>
        <div class="initBtm" @click="requestRefund">
          <div>提交</div>
        </div>
      </div>
    </div>
    <div class="payModal" v-if="PayFlag">
      <div class="pay_content">
        <div class="title">
          <p>选择支付方式</p>
          <img src="/static/images/close.png" alt @click="PayFlag=false" />
        </div>
        <div class="content">
          <div class="lineItem" @click="iscash = true">
            <p>
              <img src="/static/images/peoson_pay.png" alt class="logo" />
              现金支付
              <span>(支持微信支付)</span>
            </p>
            <img
              :src="iscash?'/static/images/pay_checked.png':'/static/images/pay_notcheck.png'"
              alt
            />
          </div>
          <div class="lineItem" @click="iscash = false" v-if="feePayStatus">
            <p>
              <img src="/static/images/yb_pay.png" alt class="logo" />
              医保支付
              <span>(支持武汉医保)</span>
            </p>
            <img
              :src="iscash?'/static/images/pay_notcheck.png':'/static/images/pay_checked.png'"
              alt
            />
          </div>
          <div class="lineItem">
            处方订单费用：
            <span class="cost">{{orderDetail.prescription_price}}</span>
          </div>
          <div class="lineItem">
            检验检查订单费用：
            <span class="cost">{{orderDetail.check_price}}</span>
          </div>
          <div class="sureBtn">
            <p class="total">
              诊疗费用合计：
              <span>{{orderDetail.sum}}</span>
            </p>
            <p class="tip">支付成功后，您可在诊疗订单、处方、检验、检查模块查看订单状态</p>
            <p class="button" @click="topay">提交</p>
          </div>
        </div>
      </div>
    </div>
    <div v-if="showProtocal" class="protocalModal">
      <div class="sure">
        <img :src="closeImg"  @click="showProtocal=false" />
        <div class="topTitle">
          {{stikyTitle}}
        </div>
        <scroll-view  @scroll="getScroll($event)" :scroll-y="true" class="protocalBox">
          <div v-for="(item,i) in nowCheckData.agree_info" :key="i" :class="'protocalDiv'">
<!--            <div class="title">{{item.title}}</div>-->
            <div class="text">
              <text>{{item.text}}</text>
              <p style="text-align:right">时间： {{item.date}}</p>
            </div>
          </div>
        </scroll-view>
        <div class="agren">
          <span class="agrenBtn" @click.stop="agree">
            已阅读
          </span>
        </div>
      </div>
    </div>
    <div v-if="modelStatus" class="payComfirmModal">
      <div class="sure">
        <div class="title">系统检测到您有待支付的处方订单，请前往填写配送地址</div>
        <div class="btm">
          <div @click="modelStatus = false" class="cancel">取消</div>
          <div @click="sureFinish">继续</div>
        </div>
      </div>
    </div>
    <!-- 自取支付确认 -->
    <div v-if="setOrder" class="payComfirmModal">
      <div class="sure">
        <div class="top fontWeight">诊疗订单通知</div>
        <div class="title2">您有新的诊疗订单，请确认！</div>
        <div class="btm">
          <!-- <div @click="setOrder = false" class="cancel">取消</div> -->
          <div class="backBlue" @click="getnewOrder" >获取新订单</div>
        </div>
      </div>
    </div>
    <i-message id="message" />
    <i-toast id="toast" />
  </div>
</template>

<script>
  let app = getApp()
  let store = app.store
  import api from '@/api/api'
  import { mapState } from 'vuex'
  const { $Toast, $Message } = require('../../../../../static/iview/base/index')
  import hbProvince from '@/utils/chronic.min'
  export default {
    data () {
      return {
        rule_text: [],
        tab: 'tab1',
        tabList: [
          {title: '全部', key: 'tab1', count: 0},
          {title: '待支付', key: 'tab2', count: 0},
          {title: '已支付', key: 'tab3', count: 0},
          // {title: '取消/退款', key: 'tab4', count: 0}
        ],
        page: 1,
        type: '', // 全部不传 待支付传1 ，已支付传2
        allOrder: [],
        pageSize: 0,
        info: {},
        noDataImg: '',
        imgUrl: '',
        topTabList: ['处方', '检验', '检查', '病理'],
        nowLiIndex: 0,
        isShow: true,
        regular_id: 0,
        visible: false,
        reason: '',
        reason_code: '',
        PayFlag: false,
        iscash: true,
        orderDetail: {},
        closeTipsImg: '',
        closeImg: '',
        showProtocal: false,
        nowCheckData: {},
        stikyTitle: '',
        scrollTop: 0,
        modelStatus:false,
        triggered: false,
        nowItem: {},
        delayShowData: true, // 加载过程
        feePayStatus: false,
        regularList: [],
        setOrder: false,
      }
    },
    onShow(){
      this.PayFlag = false
      this.visible = false
      this.modelStatus = false
      this.showProtocal = false
      this.nowItem = {}
      this.allOrder = []
      this.type = ''
      this.tab = 'tab1'
      this.page = 1
      this.info = this.$storage.getAccountInfo()
      if (typeof(this.$storage.getNowCommon()) !=='string') {
        this.regular_id = this.$storage.getNowCommon()
      }else {
        this.regular_id = this.info.regular_id
      }
      this.queryPrescriptionList()
      this.user_regular_list()
    },
    onLoad(){
      Object.assign(this.$data, this.$options.data()) // 初始化data 中的数据
      this.nowLiIndex = 0
      this.isShow = true
      this.triggered = false
      this.allOrder = []
      this.type = ''
      this.tab = 'tab1'
      this.page = 1
      this.info = this.$storage.getAccountInfo()
      this.imgUrl = api.imgUrl
      this.noDataImg = this.imgUrl + 'noData.png'
      this.closeTipsImg = this.imgUrl + "closeTips.png";
      this.closeImg = this.imgUrl + "close.png";
      this.appointmentBookingRules()
    },
    onUnload() {
      // this.$router.replace("/pages/center/main");
      this.nowLiIndex = 0
      this.$storage.removeNowCommon()
      this.nowCheckData = {}
      this.showProtocal = false
    },
    mounted () {

    },
    methods: {
      user_regular_list () {
        this.$api.user_regular_list("", { showLoading: false }).then( (res)=> {
          this.regularList = res.data

        })
      },
      appointmentBookingRules() {
        this.$api.appointmentBookingRules({rules_type: '6'}, {'showLoading': false}).then(res=>{
          this.rule_text = res.data
        })
      },
      // 获取订单详情,判断是去支付还是去省医保
    async  getDetails(order,type) {
        //FIXME 控制检验检查查询接口的逻辑写的不规范
         if (this.nowLiIndex !== 0) {  // 检验 检查 病理
            if('detail'==type){
                this.goDetails(order)
              }else if('pay'==type){
                this.goPay(order)
              }else if('prescriptionDetails'==type){
                this.goPrescriptionDetails(order)
              }
        }else{
            this.$api.getPrescriptionDetail({order_no: order.orderno}).then(res=>{
                      console.log(res.data)
                      if(res.data.url){
                          hbProvince.navigate(res.data.token);
                      }else if('detail'==type){
                        this.goDetails(order)
                      }else if('pay'==type){
                        if(mpvue.getStorageSync('insuranceOrderId')) {  // 上笔医保支付储存的 orderID
                          mpvue.removeStorage({key: 'insuranceOrderId'})
                        }
                        this.goPay(order)
                      }else if('prescriptionDetails'==type){
                        this.goPrescriptionDetails(order)
                      }
                  })
        }


      },
      getScroll (e) {  //滚动 标题粘贴顶部
        let that =this
        const query = wx.createSelectorQuery();
        let dom = query.selectAll('.protocalDiv').boundingClientRect()
        dom.exec((res)=>{
          res[0].forEach((ele,i)=>{
            if (ele.top<120) {
              that.stikyTitle = that.nowCheckData.agree_info!==[]?that.nowCheckData.agree_info[i].title:'' + '(' + (i+1) +'/' + res[0].length +')'
              return
            }
          })
        })
      },
      // 查看处方
      showPdf (no) {
        let that = this
        that.$api.prescriptionPdf({order_no: no}, {'showLoading': true}).then((res) => {
          let arr = []
          arr.push(res.data)
          mpvue.offAppHide()
          mpvue.previewImage({
            current: res.data,
            urls: arr
          })
        })
      },
      // 查看处方详情
      goPrescriptionDetails (item) {
        console.log(item)
        this.$router.push(`/pages/center/child/prescriptionDetails/main?orderno=${item.orderno}&type=${item.point_type}`)
      },
      // 同意检查协议
      agree () {
        let data = this.nowCheckData
        this.$router.push({
          path: '/pages/center/child/orderDetails/main',
          query: {
            order_no: data.orderno,
            regular_id: data.regular_id,
            order_type: this.nowLiIndex-1
          }
        })
      },
      // 订单详情页面
      goDetails (data) {
        // debugger
        if (this.nowLiIndex === 0) return
        if (this.nowLiIndex === 2 && data.agree_info && data.agree_info[0]) {
          this.nowCheckData = data
          this.stikyTitle = data.agree_info[0]?data.agree_info[0].title:'' + '(1/' + data.agree_info.length +')'
          this.showProtocal = true
          return
        }
        this.$router.push({
          path: '/pages/center/child/orderDetails/main',
          query: {
            order_no: data.orderno,
            regular_id: data.regular_id,
            order_type: this.nowLiIndex-1
          }
        })
      },
      // 查询全部信息
      queryPrescriptionList () {
        this.triggered = true
        this.delayShowData = true
        this.allOrder = []
        if (this.nowLiIndex !== 0) {  // 检验 检查 病理
          this.queryInspectList ()
          return
        }
        let that = this
        let param = {
          type: that.type,
          regular_id: that.regular_id,
          page: that.page,
          rows:10
        }
        that.$api.prescriptionList({type: that.type, regular_id: that.regular_id, page: that.page, rows:10}, {'showLoading': true}).then((res) => {
          that.pageSize = res.total / 10
          let list = []
          list = that.allOrder.concat(res.data)
          for (let  i = 0; i < list.length; i++) {
            list[i].zhifu = list[i].pay_time ? that.$utils.filterTime(list[i].pay_time, 1) : ''
            let t = (list[i].overdue_time * 1000) - new Date().getTime()  // 剩余时间减去当前时间错
            let day = Math.floor(t / 86400000);
            let hour = Math.floor((t / 3600000) % 24);
            let min = Math.floor((t / 60000) % 60);
            let sec = Math.floor((t / 1000) % 60);
            hour = hour < 10 ? "0" + hour : hour;
            min = min < 10 ? "0" + min : min;
            sec = sec < 10 ? "0" + sec : sec;
            let format = '';
            if (day > 0) {
              format = `${day}天${hour}时${min}分${sec}秒`;
            }
            if (day <= 0 && hour > 0) {
              format = `${hour}时${min}分${sec}秒`;
            }
            if (day <= 0 && hour <= 0) {
              format = `${min}分${sec}秒`;
            }
            that.$set(list[i], 'countDown', format)
            let timer = setInterval(function() {
              if (list[i].status !== '0' && list[i].status !== '10') {
                clearInterval(timer)
              }
              t -= 1000
              if (t > 0) {
                let day = Math.floor(t / 86400000);
                let hour = Math.floor((t / 3600000) % 24);
                let min = Math.floor((t / 60000) % 60);
                let sec = Math.floor((t / 1000) % 60);
                hour = hour < 10 ? "0" + hour : hour;
                min = min < 10 ? "0" + min : min;
                sec = sec < 10 ? "0" + sec : sec;
                let format = '';
                if (day > 0) {
                  format = `${day}天${hour}时${min}分${sec}秒`;
                }
                if (day <= 0 && hour > 0) {
                  format = `${hour}时${min}分${sec}秒`;
                }
                if (day <= 0 && hour <= 0) {
                  format = `${min}分${sec}秒`;
                }
                if (day ==0 && hour == 0 && min == 0 && sec == '00') {
                  console.log('剩余支付时间到了')
                }
                that.$set(list[i], 'countDown', format)
              } else {
              }
              for(var k in list[i]){
                if(list[i].k == '' || list[i].k ==null){
                  list[i].k == ' '
                }
              }
            }, 1000)
          }
          that.allOrder = list
          that.delayShowData = false
          that.triggered = false
          if (that.allOrder.length > 0) {
            wx.showToast({
              title: '刷新成功',
              icon: 'none',
              duration: 1000
            })
          }
          console.log(" that.allOrder", that.allOrder)
        })
      },
      // 检验检查查询列表
      queryInspectList () {
        let that = this
        console.log(that.nowLiIndex -1)
        let param = {
          type: that.type + '',
          regular_id: that.regular_id + '',
          page: that.page + '',
          rows:'99999',
          check_type: that.nowLiIndex -1 + ''
        }
        this.$api.inspectionCheckOrderFirst(param, {'showLoading': true}).then(res => {
          that.pageSize = res.total / 10
          let list = []
          list = that.allOrder.concat(res.data)
          for (let  i = 0; i < list.length; i++) {
            list[i].zhifu = list[i].pay_time ? that.$utils.filterTime(list[i].pay_time, 1) : ''
            let t = (list[i].overdue_time * 1000) - new Date().getTime()  // 剩余时间减去当前时间错
            let day = Math.floor(t / 86400000);
            let hour = Math.floor((t / 3600000) % 24);
            let min = Math.floor((t / 60000) % 60);
            let sec = Math.floor((t / 1000) % 60);
            hour = hour < 10 ? "0" + hour : hour;
            min = min < 10 ? "0" + min : min;
            sec = sec < 10 ? "0" + sec : sec;
            let format = '';
            if (day > 0) {
              format = `${day}天${hour}时${min}分${sec}秒`;
            }
            if (day <= 0 && hour > 0) {
              format = `${hour}时${min}分${sec}秒`;
            }
            if (day <= 0 && hour <= 0) {
              format = `${min}分${sec}秒`;
            }
            that.$set(list[i], 'countDown', format)
            let timer = setInterval(function() {
              if (list[i].status !== '0' && list[i].status !== '10') {
                clearInterval(timer)
              }
              t -= 1000
              if (t > 0) {
                let day = Math.floor(t / 86400000);
                let hour = Math.floor((t / 3600000) % 24);
                let min = Math.floor((t / 60000) % 60);
                let sec = Math.floor((t / 1000) % 60);
                hour = hour < 10 ? "0" + hour : hour;
                min = min < 10 ? "0" + min : min;
                sec = sec < 10 ? "0" + sec : sec;
                let format = '';
                if (day > 0) {
                  format = `${day}天${hour}时${min}分${sec}秒`;
                }
                if (day <= 0 && hour > 0) {
                  format = `${hour}时${min}分${sec}秒`;
                }
                if (day <= 0 && hour <= 0) {
                  format = `${min}分${sec}秒`;
                }
                if (day ==0 && hour == 0 && min == 0 && sec == '00') {
                  console.log('剩余支付时间到了')
                }
                that.$set(list[i], 'countDown', format)
              } else {
              }
              for(var k in list[i]){
                if(list[i].k == '' || list[i].k ==null){
                  list[i].k == ' '
                }
              }
            }, 1000)
          }
          console.log(list,'支付权限')
          that.allOrder = list
          that.delayShowData = false
          that.triggered = false
          if(that.allOrder.length > 0) {
            wx.showToast({
              title: '刷新成功',
              icon: 'none',
              duration: 1000
            })
          }
        })
      },
      // 点击tab
      handleChange (key) {
        let that = this
        that.tab = key
        that.page = 1
        switch (key) {
          case 'tab1' :
          that.type = ''
            break
          case 'tab2' :
          that.type = '1'
            break
          case 'tab3' :
          that.type = '2'
            break
          case 'tab4' :
          that.type = '3'
            break
        }
        that.allOrder = []
        that.queryPrescriptionList()
      },
      // 切换当前就诊人
      goCheckout() {
        this.$router.push('/pages/center/child/checkoutCommon/main')
      },
      // 顶部导航
      chooseTopType(index) {
        this.nowLiIndex = index
        if (index > 0 && this.tabList.length < 4) {
          this.tabList.push({
            title: '取消/退款',
            key: 'tab4',
            count: 0
          })
          this.$forceUpdate()
        } else if (index===0 && this.tabList.length>3) {
          this.tab = 'tab1'
          this.tabList.pop()
          this.$forceUpdate()
        }
        this.tab = 'tab1'
        this.type = ''
        this.queryPrescriptionList()
      },
      // 申请退款
      refundMoney(item) {
        console.log(item)
        this.nowOrderId = item.order_id
        this.reason = "";
        this.visible = true;
      },
      // 修改退款原因
      changeRadio(e) {
        console.log(e.mp.detail.value);
        this.reason_code = e.mp.detail.value;
      },
      // 文本框改变
      inputchange(e) {
        let stringStr = e.target.value.substring(0, 1);
        this.reason = e.target.value;
        if (stringStr == " ") {
          this.reason = this.reason.substring(1, this.reason.length);
        }
      },
      //确定退款
      requestRefund() {
        var that = this;
        let data = {
          order_id: that.nowOrderId,
          cancel_reason_code: that.reason_code,
          reason_text: that.reason
        };
        that.$api.requestRefund(data, { showLoading: true }).then(res => {
          that.visible = false
          this.queryPrescriptionList()
          this.nowOrderId = ''
        });
        setTimeout(() => {
          that.visible = false
          this.queryPrescriptionList()
        }, 500);
      },
      sureFinish() {
        this.goPrescriptionDetails(this.nowItem)
      },
      // 去支付
      goPay (item) {
        //  获取订单信息， 校验是否包含处方订单
        console.log(item, 'item')
        this.iscash = true
        this.feePayStatus = false
        for (let i = 0; i < this.regularList.length; i++) {
          if (item.regular_id == this.regularList[i].regular_id) {
            if (this.regularList[i].fee_type_code == 'WHA01') {
              this.feePayStatus = true
            }
          }
        }
        this.$api.pay_hint({order_no:item.orderno}, { showLoading: true }).then(res => {
          this.orderDetail = res.data;
          if(res.data.to_prescription_detail) {  // 包含处方需要填写地址
            // this.$router.push(`/pages/center/child/address/main?orderno=${item.orderno}&pay=${item.ordersum}&type=1&orderId=${item.order_id}`)
            this.nowItem = item
            this.modelStatus = true
          } else {
            this.nowOrderId = item.order_id
            this.PayFlag = true;
          }
        });
      },
      // 获取新订单
      getnewOrder() {
        this.setOrder = false
        this.PayFlag = false
        this.queryInspectList()
      },
      // 检验检查 直接支付
    async  topay() {
        // 检测支付订单与实际订单做对比
        let result = await this.$api.orderPayWechatMini({ order_id: this.nowOrderId },{ showLoading: true })
        if(result.msg.indexOf("您有新的诊疗订单") > -1) {
          this.setOrder = true
          return
        }
        var that = this;
        if (this.iscash) {
          that.$storage.setCardeStatus(2);
          this.$router.push(
            `/pages/center/child/pay/main?orderId=${that.nowOrderId}&sum=${
              this.orderDetail.sum
            }&way=1`
          );
        } else {
          console.log("医保");
          that.$api.get_user_info("", { showLoading: true }).then(function(res) {
            var userInfo = res.data[0];
            console.log("userInfo.insurance_card", userInfo.insurance_card);

            if (userInfo.insurance_card) {
              that.$storage.setCardeStatus(2);
              that.$router.push(
                `/pages/center/child/pay/main?orderId=${that.nowOrderId }&sum=${
                  that.orderDetail.sum
                }&way=2`
              );
            } else {
              that.$storage.setCardeStatus(4);
              that.$router.push(
                `/pages/center/child/makeSure/main?orderId=${that.nowOrderId }&sum=${
                  that.orderDetail.sum
                }`
              );
            }
          });
        }
      }
    }
  }
</script>

<style scoped lang='less'>
.subPage {
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
  }
  .subTop {
    height: 90rpx;
    width: 100%;
    background-color: #FFFFFF;
    border-bottom: 1rpx solid #DDDDDD;
    box-sizing: border-box;
    ul {
      position: relative;
      height: 100%;
      list-style: none;
      width: 100%;
      font-size: 30rpx;
      color: #666666;
      display: flex;
      li {
        flex: 1;
        text-align: center;
        line-height: 90rpx;
      }
      .nowTab {
        color: #4B7AEA;
        font-weight: 600px;
      }
    }
    .slideSpan {
      position: absolute;
      height: 5rpx;
      width: 100rpx;
      background-color: #4B7AEA;
      bottom: 0;
      left: 10%;
      transition: left ease 0.3s;
    }
    .chooseTabSpan2 {
      left: 43.5%;
    }
    .chooseTabSpan3 {
      left: 77%;
    }
    .chooseTabSpan11 {
      left: 6%;
    }
    .chooseTabSpan12 {
      left: 31%;
    }
    .chooseTabSpan13 {
      left: 56%;
    }
    .chooseTabSpan14 {
      left: 80%;
    }
  }
  .topTab {
    background-color: #F9F9F9;
    padding: 14rpx 31rpx 14rpx 25rpx;
      ul {
        display: flex;
        background-color: #E1EAFF;
        width: 100%;
        height: 86rpx;
        border-radius: 40rpx;
        padding: 6rpx;
        box-sizing: border-box;
        li {
          flex: 1;
          text-align: center;
          line-height: 78rpx;
          color: #4B7AEA;
          font-size:36rpx;
        }
        .nowLi {
          background: #fff;
          border-radius: 48rpx;
        }
      }
  }
  .sideBtn {
      position: absolute;
      right: 0px;
      bottom: 30%;
      height: 76rpx;
      width: 140rpx;
      background-color: #0088FF;
      border-radius: 38rpx 0 0 38rpx;
      z-index: 999;
      transition: 0.5s all ease-in-out 0s;
      .left {
        float: left;
        height: 100%;
        width: 40%;
        img {
          height: 35rpx;
          width: 20rpx;
          position: absolute;
          top: 50%;
          left: 23rpx;
          transition: 0.3s all ease-in-out 0.5s;
          transform: translateY(-50%) rotate(180deg);
        }
      }
      .btn {
        float: left;
        height: 100%;
        width: 60%;
        line-height: 76rpx;
        // text-align: center;
        letter-spacing: 2rpx;
        color: #fff;
      }
    }
    .sideBtn.hidden {
      right: -85rpx;
      img {
        transform: translateY(-50%) rotate(0deg);
      }
  }
  .content {
    flex: 1;
    height: 100%;
    background: #F9F9F9;
    overflow-x: hidden;
    overflow-y: hidden;
    position: relative;
    .allList {
      // height: 100%;
      margin: 28rpx 30rpx 0 30rpx;
      ul {
        display: block;
        width: 100%;
        // height: 100%;
        li {
          /* height:516rpx; */
          background:rgba(255,255,255,1);
          box-shadow:0rpx 2rpx 12rpx 1rpx rgba(0,0,0,0.11);
          border-radius:16rpx;
          background: #fff;
          margin-bottom: 30rpx;
          box-sizing: border-box;
          padding-bottom: 1rpx;
          .initTop {
            height: 70rpx;
            border-bottom: 1rpx solid #E9E9E9;
            padding: 0 25rpx 0 35rpx;
            .orderno {
              font-size:28rpx;
              color: #666666;
              margin-top: 17rpx;
            }
            .status {
              font-size:28rpx;
              height: 50rpx;
              line-height: 50rpx;
              padding: 0 20rpx;
              border-radius:25rpx;
              display: inline-block;
              margin-top: 10rpx;
            }
            .status236 {
              background: #EBF5FF;
              color: #258FF8;
            }
            .status0 {
              background: #FFf5EE;
              color: #FF7F29;
            }
            .status13 {
              background: #FFF5EE;
              color: #FF7F29;
            }
            .status23 {
              background: #EBF5FF;
              color: #258FF8;
            }
            .status512 {
              background: #FFE9E9;
              color: #F82625;
            }
            .statuselse {
              background: #DDFFED;
              color: #10C15B;
            }
          }
          .initBtm {
            margin: 24rpx 25rpx 28rpx 35rpx;
            .itemLine1 {
              height: 60rpx;
              line-height: 60rpx;
              overflow: hidden;
            }
            .shengyu {
              color: #FF7F29;
            }
            .xiegang {
              display: inline-block;
              color: #CCCCCC;
              margin: 0 10rpx;
            }
            .doctorName {
              display: inline-block;
              margin-right: 36rpx;
              font-size: 44rpx;
              font-weight: bold;
              color: rgba(74, 113, 232, 1);
            }
            .btmFlex {
              display: flex;
              .itemBtmFl {
                width: 160rpx;
                overflow: hidden;
                .lineTitle {
                  font-size: 32rpx;
                  font-weight: 400;
                  color: rgba(102, 102, 102, 1);
                }
              }
              .itemBtmFr {
                margin-left: 6rpx;
                font-size: 32rpx;
                flex: 1;
                color: #333;
                font-size: 32rpx;
                overflow: hidden;
                // width: 100%;
                // overflow: hidden;
                .yaoping {
                  width: 100%;
                  height: 60rpx;
                  line-height: 60rpx;
                  word-break: break-all;
                  display: flex;
                  div:nth-child(1) {
                    // width: 81%;
                    flex: 1;
                    height:60rpx;
                    // word-break: break-all;
                    // overflow:hidden;
                    display: -webkit-box;
                    -webkit-box-orient: vertical;
                    -webkit-line-clamp: 1;
                    overflow: hidden;
                  }
                  div:nth-child(2) {
                    // width: 19%;
                  }
                }
              }
            }
          }
          .do {
            margin-top: 16rpx;
            .doBtn {
              height: 76rpx;
              line-height: 76rpx;
              font-size:32rpx;
              border: 1px solid #ADADAD;
              border-radius:38rpx;
              padding: 0 50rpx;
              color: #666;
              margin-left: 20rpx;
            }
            .look {
              margin-left: 20rpx;
            }
          }
        }
        li:last-child {
          // margin-bottom: 0!important;
        }
      }
    }
  }
  .describe {
      margin: 30rpx auto;
      bottom: 40rpx;
      width: 93%;
      background: #eaf3fe;
      border-radius: 16rpx;
      color: #4a71e8;
      padding: 34rpx 22rpx 30rpx 22rpx;
      box-sizing: border-box;
      font-size: 28rpx;
    line-height: 40rpx;
      span {
        color: #ff5453;
      }
    }
  .bg {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: rgba(0, 0, 0, 0.7);
    .init {
      position: absolute;
      left: 0;
      bottom: 0;
      width: 100%;
      min-height: 660rpx;
      overflow: hidden;
      background: #fff;
      z-index: 2;
      display: flex;
      flex-direction: column;
      .initTop {
        height: 90rpx;
        line-height: 90rpx;
        font-size: 34rpx;
        font-weight: bold;
        text-align: center;
        position: relative;
        border-bottom: 2rpx solid #e9e9e9;
        img {
          width: 45rpx;
          height: 45rpx;
          position: absolute;
          top: 26rpx;
          right: 20rpx;
        }
      }
      .initMid {
        flex: 1;
        .areaDiv {
          border-top: 1rpx solid #e9e9e9;
          border-bottom: 1rpx solid #e9e9e9;
          height: 110rpx;
          padding: 25rpx 30rpx;
        }
        .radio {
          margin-top: 30rpx;
        }
        .lastRadio {
          margin-bottom: 30rpx;
        }
        textarea {
          height: 80rpx;
          width: 100%;
        }
      }
      .initBtm {
        height: 160rpx;
        padding: 0rpx 45rpx 0 45rpx;
        div {
          margin-top: 20rpx;
          width: 100%;
          height: 100rpx;
          line-height: 90rpx;
          background: #4a64ea;
          border-radius: 46px;
          text-align: center;
          font-size: 32rpx;
          color: #fff;
          font-weight: bold;
        }
      }
    }
  }
  .protocalModal {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.7);
    .sure {
      z-index: 2;
      width: 640rpx;
      height: 840rpx;
      background: #fff;
      position: relative;
      left: 50%;
      top: 50%;
      margin-left: -320rpx;
      margin-top: -420rpx;
      border-radius: 7px;
      display: flex;
      flex-direction: column;
      font-size: 28rpx;
      .topTitle {
        // height: 70rpx;
        width: 100%;
        font-size: 34rpx;
        font-weight: bold;
        color: rgba(51, 51, 51, 1);
        line-height: 48rpx;
        text-align: center;
        margin: 20rpx 0 0rpx;
        padding-bottom: 20rpx;
        border-bottom: 1rpx solid #E9E9E9;
      }
      .protocalBox {
        height: 100%;
        width: 100%;
        overflow-x: hidden;
        overflow-y: scroll;
      }
      .protocalBox::-webkit-scrollbar {
        display: none;
      }
      img {
        width: 60rpx;
        height: 60rpx;
        position: absolute;
        right: -30rpx;
        top: -30rpx;
        z-index: 10;
      }
      .title {
        height: 48rpx;
        font-size: 34rpx;
        font-weight: bold;
        color: rgba(51, 51, 51, 1);
        line-height: 48rpx;
        text-align: center;
        margin: 29rpx 0 24rpx;
      }
      .text {
        padding: 0 40rpx;
        line-height: 40rpx;
        font-size: 28rpx;
        color: #666666;
        flex: 1;
        overflow-y: auto;
      }
      .agren {
        text-align: center;
        margin-top: 20rpx;
        margin-bottom: 43rpx;
        .agrenBtn {
          height: 76rpx;
          line-height: 76rpx;
          display: inline-block;
          padding: 0 180rpx;
          background: #4a64ea;
          font-size: 28rpx;
          color: #fff;
          border-radius: 38rpx;
        }
        .countdow {
          height: 76rpx;
          line-height: 76rpx;
          display: inline-block;
          color: red;
          font-size: 28rpx;
        }
      }
    }
  }
  .payModal {
    position: absolute;
    top: 0;
    left: 0;
    // bottom: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
    z-index: 99999;
    .pay_content {
      position: absolute;
      bottom: 0;
      width: 100%;
      height: 850rpx;
      background-color: #fff;
      .title {
        width: 100%;
        height: 90rpx;
        border-bottom: 1rpx solid #e9e9e9;
        color: #333;
        font-size: 34rpx;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 500;
        text-align: center;
        line-height: 90rpx;
        display: flex;
        p {
          flex: 1;
          color: #333;
          font-size: 32rpx;
        }
        img {
          width: 45rpx;
          height: 45rpx;
          margin: 20rpx 20rpx 0 0;
          display: inline-block;
        }
      }
      .lineItem {
        width: 100%;
        height: 100rpx;
        border-bottom: 1rpx solid #e9e9e9;
        display: flex;
        flex-direction: row;
        align-items: center;
        box-sizing: border-box;
        padding-left: 30rpx;
        color: #666;
        .cost {
          color: #333;
        }
        p {
          flex: 1;
          display: flex;
          flex-direction: row;
          align-items: center;
          color: #333;
          img {
            margin-left: 0;
          }
          span {
            color: #999;
            font-size: 28rpx;
          }
        }
        img {
          width: 50rpx;
          height: 50rpx;
          margin: 0 30rpx;
        }
      }
      .sureBtn {
        padding:0 30rpx;
        box-sizing: border-box;
        color: #666;
        .total {
          margin: 30rpx 0;
          span {
            color: #ff5453;
            font-size: 36rpx;
          }
        }
        .tip {
          margin: 10rpx 30rpx 50rpx 0;
          font-size: 26rpx;
          color: rgba(153, 153, 153, 1);
        }
        .button {
          // width: 660rpx;
          height: 92rpx;
          background: rgba(74, 100, 234, 1);
          line-height: 92rpx;
          text-align: center;
          color: #fff;
          border-radius: 46rpx;
        }
      }
    }
  }
  .payComfirmModal {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 999999;
    .sure {
      z-index: 2;
      width: 650rpx;
      height: 410rpx;
      overflow: hidden;
      background: #fff;
      position: absolute;
      left: 50%;
      top: 50%;
      margin-left: -325rpx;
      margin-top: -205rpx;
      border-radius: 8rpx;
      display: flex;
      flex-direction: column;
      font-size: 34rpx;
      .top {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .fontWeight{
        font-weight: bold;
      }
      .title {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 40rpx;
        padding: 0 30rpx;
      }
      .title2{
        flex: 1;
        display: flex;
        // align-items: center;
        justify-content: center;
        // margin-top: 20rpx;
        padding: 0 30rpx;
      }
      .topTips {
        flex: 1;
        margin: 136rpx 100rpx 0 99rpx;
      }
      .btm {
        height: 100rpx;
        display: flex;
        div {
          flex: 1;
          line-height: 100rpx;
          text-align: center;
          background: #f7f8fa;
        }
        div:nth-child(2) {
          background:#4A64EA;
          color: #fff;
        }
        .backBlue {
          background:#4A64EA;
          color: #fff;
        }
      }
    }
  }
  .content::-webkit-scrollbar {
    display:none
  }
</style>
